Skip to content

Migrate the site theming MCP tool#214

Merged
sf-cboscenco merged 8 commits intomainfrom
feature-W-20796653-site-theming-mcp-tool
Feb 26, 2026
Merged

Migrate the site theming MCP tool#214
sf-cboscenco merged 8 commits intomainfrom
feature-W-20796653-site-theming-mcp-tool

Conversation

@sf-cboscenco
Copy link
Contributor

@sf-cboscenco sf-cboscenco commented Feb 26, 2026 •
edited
Loading

Summary

Adds the storefront_next_site_theming MCP tool for Storefront Next. The tool guides theming changes (colors, fonts, visual styling) and validates color combinations for WCAG 2.1 accessibility.

Testing

Tests are included in the PR, also manual test instructions are available in the Readme.md on the test path.

Dependencies

  • No net-new third-party dependencies were added
  • If net-new third-party dependencies were added, rationale/discussion is included and 3pl-approved is set by a maintainer
  • Tests pass (pnpm test)
  • Code is formatted (pnpm run format)

@sf-cboscenco
Copy link
Contributor Author

sf-cboscenco commented Feb 26, 2026

Site Theming MCP Tool – Staged Changes Summary

Branch: feature-W-20796653-site-theming-mcp-tool
Date: 2025-02-25

Overview

Adds the storefront_next_site_theming MCP tool for Storefront Next. The tool guides theming changes (colors, fonts, visual styling) and validates color combinations for WCAG 2.1 accessibility.

Staged Files (15 files, +3,299 / -1 lines)

Changeset

File Purpose
.changeset/site-theming-mcp-tool.md Minor bump for @salesforce/b2c-dx-mcp; release notes

Documentation

File Purpose
packages/b2c-dx-mcp/README.md Site Theming section, prompt examples, tool table entry
packages/b2c-dx-mcp/src/tools/storefrontnext/README.md Tool docs: parameters, returns, example usage, architecture

Content (3 files)

File Purpose
content/site-theming/theming-accessibility.md WCAG guidelines, contrast ratios, font accessibility, color blindness, focus/keyboard, screen readers
content/site-theming/theming-questions.md Layout preservation, specification compliance, workflow (extraction, updating), DO/DON'T
content/site-theming/theming-validation.md Validation gate workflow, pre-implementation checklist, color/font validation, how to trigger validation

Implementation (5 files)

File Purpose
src/tools/storefrontnext/index.ts Register createSiteThemingTool in STOREFRONTNEXT tools
src/tools/storefrontnext/site-theming/index.ts Main tool: createSiteThemingTool, question flow, color validation, response generation
src/tools/storefrontnext/site-theming/theming-store.ts Content loading, markdown parsing, THEMING_FILES env, init guard
src/tools/storefrontnext/site-theming/color-contrast.ts WCAG 2.1 luminance, contrast ratio, validateContrast, validateColorCombinations
src/tools/storefrontnext/site-theming/README.md Tool docs: overview, workflow, usage, architecture

Tests (4 files)

File Purpose
test/tools/storefrontnext/site-theming/index.test.ts Tool metadata, behavior, question filtering, color validation, file merging, edge cases
test/tools/storefrontnext/site-theming/color-contrast.test.ts getLuminance, isValidHex, getContrastRatio, getWCAGLevel, validateContrast, formatValidationResult
test/tools/storefrontnext/site-theming/theming-store.test.ts initialize, get/getKeys, loadFile, THEMING_FILES env, workflow/validation parsing
test/tools/storefrontnext/site-theming/README.md Test instructions, manual scenarios

Key Features

  • Mandatory workflow: Questions → validation → confirmation → implement
  • WCAG validation: Automatic contrast checks when colorMapping is provided (colorMapping alone is sufficient)
  • Content-driven: Markdown in content/site-theming/ drives questions and rules
  • Merge support: fileKey / fileKeys for custom content; THEMING_FILES env
  • Init guard: Skips re-loading when workspace root is unchanged
  • Logger: Warnings use project logger instead of stderr

@yhsieh1
Copy link
Contributor

yhsieh1 commented Feb 26, 2026 •
edited
Loading

@sf-cboscenco Could you pull changes from main and there is TF in this PR? Please attach a demo recording or screen shoot so we have better understanding how the tool interact with user.

yhsieh1
yhsieh1 reviewed Feb 26, 2026
View reviewed changes
yhsieh1
yhsieh1 reviewed Feb 26, 2026
View reviewed changes
yhsieh1
yhsieh1 reviewed Feb 26, 2026
View reviewed changes
@sf-cboscenco
Copy link
Contributor Author

sf-cboscenco commented Feb 26, 2026

@sf-cboscenco Could you pull changes from main and there is TF in this PR? Please attach a demo recording or screen shoot so we have better understanding how the tool interact with user.

Done.

yhsieh1
yhsieh1 reviewed Feb 26, 2026
View reviewed changes
@sf-cboscenco
Merge branch 'main' into feature-W-20796653-site-theming-mcp-tool
f8c0a17
@sf-cboscenco
site-theming follow-ups
c5aaeed 
- Use resolveWithProjectDirectory() in site-theming tool
- Add storefront_next_site_theming to docs sidebar
- Expand site-theming doc with more usage examples
yhsieh1
yhsieh1 approved these changes Feb 26, 2026
View reviewed changes
Copy link
Contributor

@yhsieh1 yhsieh1 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It looks good to me.

@sf-cboscenco
Copy link
Contributor Author

sf-cboscenco commented Feb 26, 2026

Demo videos provided by Madhuri Uppu, thank you:
https://drive.google.com/file/d/1-LpDeVDw6aKNYzcF_04UaqyjCWIdO0Y5/view?usp=sharing - cursor rules
https://drive.google.com/file/d/1VlEIklAbqw6moDOorLOed86RpzdjuWUG/view?usp=sharing - This is for the mcp tool (

@sf-cboscenco sf-cboscenco merged commit 3b6acf2 into main Feb 26, 2026
4 of 6 checks passed
@sf-cboscenco sf-cboscenco deleted the feature-W-20796653-site-theming-mcp-tool branch February 26, 2026 23:33
patricksullivansf added a commit that referenced this pull request Feb 27, 2026
@patricksullivansf
MCP READMEs simplified incorporate PRs #212, #214
a129452
patricksullivansf added a commit that referenced this pull request Feb 27, 2026
@patricksullivansf
MCP READMEs simplified and deduplicated with official documentation (#…
2ca3b36 
…220)

* MCP READMEs simplified and deduplicated with official documentation

* MCP READMEs simplified incorporate PRs #212, #214
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@patricksullivansf patricksullivansf patricksullivansf approved these changes

@yhsieh1 yhsieh1 yhsieh1 approved these changes

@wei-liu-sf wei-liu-sf Awaiting requested review from wei-liu-sf wei-liu-sf is a code owner

@clavery clavery Awaiting requested review from clavery

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@sf-cboscenco @yhsieh1 @patricksullivansf